<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>显示模式</title>
		<link href="css/display.css" rel="stylesheet"/>
	</head>
	<body>
		<!-- 
		元素显示：
		1.块元素block:
		比较霸道，单独占一行
		默认的宽度和父级元素一样宽（父级元素宽度100%）
		可以设置对齐属性
		块级元素内可以包含行内元素或块元素（块元素中包含其他块元素和行内元素）
		div,ul,ol,li,p,h1~h6
		
		2.行内元素inline:(链接里面不能放链接)
		
		一行显示多个 
		默认的宽度就是内容的宽度
		宽，高属性无效
		不能设置对齐属性
		行内元素只包含文本或其他行内元素
		span,a，del,strong
		
		3.行内块元素inline-block:
		
		一行显示多个，两个行内块元素之间有一定的空白间距
		默认的宽度就是内容的宽度
		可以给盒子设宽，高
		input,img,td
		元素显示模式的转换:
		display:模式的名称
		
		-->
		<div class="box"></div>
		<p class="box">hello 段落</p>
		<h1>一级标签</h1>
		<span class="box">hello span</span>
		<del>hello 删除线</del>
		<a href="#">
		</a>
	</body>
</html>
